html,body,.app-login,#app,.app-content,.main{
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	min-width: 1440px;
	font-size: 16px;
}
/*.app-login{
	background-image: url(../images/backgroung_denglu.png) ;
	background-repeat:  no-repeat;
	background-size: 100%;

}*/
.app-login header{
	margin-top: 120px;
	text-align: center;
}
.app-login header h1{
	font-family: Arial-BoldMT;
	font-size: 50px;
	color: #FFFFFF;
	margin: 0;
}
.app-login header h2{
	font-family: ArialMT;
	font-size: 36px;
	color: #FFFFFF;
	margin: 0;
}
.app-login form{
	text-align: center;
    width: 342px;
    position: absolute;
    top:70%;
    transform:translateY(-70%);
    /*bottom: 240px;*/
    left: calc((100% - 342px) /2);
    animation:2s From;
}
.app-login form:before{
	content: '';
  width: 400px;
  left:-25px;
  position: absolute;
  z-index: -1;
  top: -33px;
  background: rgba(245,245,245,0.6);
  border-radius: 5px;
  height: 300px;
}
@keyframes From{
	0%{
		opacity: 0;
		transform:scale(1.3);
		top: 52%;
	}
	25%{
		opacity: 0.25;
		transform:scale(1.1);
	}
	50%{
		opacity: 0.5;
		transform:scale(0.9);
		top: 52%;
	}
	75%{
		opacity: 0.75;
		transform:scale(1.1);
		top: 52%;
	}
	100%{
		opacity: 1;
		transform:scale(1);
		top: 52%;
	}
}
.app-login img{
	width: 35px;
  position: absolute;
  margin: 12px 0px 0 -55px;
  z-index: 88;
}
.app-login input {
	display: inline-block;
	width: 340px;
	height: 60px;
	font-size: 15px;
	padding-left: 7px;
	margin-bottom: 10px;
	border-radius: 4px;
	background: rgb(252,252,252);
	border: solid 1px #e1e1e1;
}
.app-login button{
	background: #4291E1;
	border: none;
	border-radius: 4px;
	width: 349px;
	height: 60px;
	font-family: PingFangSC-Medium;
	font-size: 18px;
	color: #FFFFFF;
	margin-top: 30px;
	letter-spacing: 1.29px;
}
.app-login footer{
	width: 100%;
	position: fixed;
	text-align: center;
	bottom:28px;
	font-family: PingFangSC-Regular;
	font-size: 12px;
	color: #B7B7B7;
	letter-spacing: 0.86px;
}

.wave {
    position: relative;
    align-items: center;
    min-height: 100vh;
    background-color: #fff;
  	transform: translate(38%,-68%);
  	z-index: -1;
}
.wave:before, .wave:after {	
	content: "";
    position: absolute;
    left: 10%;
    min-width: 300vw;
    min-height: 300vw;
    background: linear-gradient(to bottom,rgb(96,201,222), rgb(54,114,224));
    animation-name: rotate;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
 
.wave:before {
    bottom: 15vh;
    border-radius: 44%;
    animation-duration: 15s;
}
 
.wave:after {
    bottom: 12vh;
    opacity: .5;
    border-radius: 43%;
    animation-duration: 15s;
}
@keyframes rotate {
    0% {
        transform: translate(-50%, 0) rotateZ(0deg);
    }
    50% {
        transform: translate(-50%, -2%) rotateZ(180deg);
    }
    100% {
        transform: translate(-50%, 0%) rotateZ(360deg);
    }
}

.loginImage{
	position: absolute;
  top: 60%;
  width: 100vw;
  text-align: center;
  transform:translateY(-60%);
}
.loginImage img{
	width: 100px;
}

